<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>项目圈主页</title>
		<link rel="stylesheet" type="text/css" href="css/common.css"/>
		<link rel="stylesheet" type="text/css" href="css/global.css"/>
	</head>
	<body>
		<!--公共头部 start-->
		<div class="commonHead">
			<div class="commonHeadLeft">
				<span class="logo"></span>
				<b>PIAQ</b>
			</div>
			<div class="commonHeadCenter">
				<ul>
					<li>
						<a class="active">项目圈</a>
					</li>
					<li>
						<a>材料数据库</a>
					</li>
					<li>
						<a>计算工具</a>
					</li>
					<li class="clear"></li>
				</ul>
			</div>
			<div class="commonHeadRight">
				<div class="infoCenter">
					<a href="javascript:void(0);">
						<span class="logo"></span>
						<span>消息中心</span>
						<span class="remindCircle"></span>
					</a>
				</div>
				<div class="loginInfo">
					<span class="loginName">KDD</span>
					<span class="logo"></span>
				</div>
				<div class="clear"></div>
			</div>
			<div class="clear"></div>
		</div>
		<!--公共头部 end-->
		
		<!--公共侧边栏 start-->
		<div class="commonSide">
			<div class="sideTitle">项目圈</div>
			<ul class="sideMenu">
				<li class="active">
					<a href="javascript:void(0);">
						<span class="logo"></span>
						<span>我的项目</span>
					</a>
				</li>
				<li>
					<a href="javascript:void(0);">
						<span class="logo"></span>
						<span>我的材料库</span>
					</a>
				</li>
				<li>
					<a href="javascript:void(0);">
						<span class="logo"></span>
						<span>我的收藏</span>
					</a>
				</li>
			</ul>
		</div>
		<!--公共侧边栏 end-->
		
		<!--内容 start-->
		<div class="content">
			<div class="contentTop">
				<div class="contentTitle">北京学清园小区</div>
				<button class="contentControl">人员管理</button>
				<div class="help">
					<a href="javascript:void(0)">
						<span class="logo"></span>
						<span>使用帮助</span>						
					</a>
				</div>
				<div class="clear"></div>
			</div>
			
			<!--项目圈内容 start-->
			<div class="projectCircleIndex">
				<div class="projectBox">
					<div class="projectBoxTop">
						<span class="projectBoxName">项目周期</span>
						<span>2017-02-23 至 2017-03-29</span>
						
					</div>
					<div class="stepStatus">
						<div class="step">
							<div class="stepDec active">
								<div class="stepNum">1</div>
								<div class="stepName">启动</div>
							</div>
							<div class="stepLine">
								<div class="prepareLine hidden"></div>
								<div class="finishLine"></div>
							</div>
							<div class="clear"></div>
						</div>
						<div class="step">
							<div class="stepDec">
								<div class="stepNum">2</div>
								<div class="stepName">方案选定</div>
							</div>
							<div class="stepLine">
								<div class="prepareLine "></div>
								<div class="finishLine hidden"></div>
							</div>
							<div class="clear"></div>
						</div>
						<div class="step">
							<div class="stepDec">
								<div class="stepNum">3</div>
								<div class="stepName">材料选定</div>
							</div>
							<div class="stepLine">
								<div class="prepareLine"></div>
								<div class="finishLine hidden"></div>
							</div>
							<div class="clear"></div>
						</div>
						<div class="step">
							<div class="stepDec">
								<div class="stepNum">4</div>
								<div class="stepName">抽烟通过</div>
							</div>
							<div class="stepLine">
								<div class="prepareLine"></div>
								<div class="finishLine hidden"></div>
							</div>
							<div class="clear"></div>
						</div>
						<div class="step">
							<div class="stepDec">
								<div class="stepNum">5</div>
								<div class="stepName">验收</div>
							</div>
							<div class="clear"></div>
						</div>
						<div class="clear"></div>
					</div>
				</div>
				
				<div class="projectBox">
					<div class="projectBoxTop">
						<span class="projectBoxName">项目概况</span>
					</div>
					<div class="projectCondition">
						<div class="conditonList">
							<div class="strip">
								<div class="name">项目名称</div>
								<div class="dec">北京学清苑小区</div>
								<div class="clear"></div>
							</div>
							<div class="strip">
								<div class="name">项目地址</div>
								<div class="dec">广东省深圳市福田侨香路3200路</div>
								<div class="clear"></div>
							</div>
							<div class="strip">
								<div class="name">交付状态</div>
								<div class="dec">硬装交</div>
								<div class="clear"></div>
							</div>
							<div class="strip">
								<div class="name">建筑类型</div>
								<div class="dec">星级酒店</div>
								<div class="clear"></div>
							</div>
						</div>
						<div class="conditonList lastConditionList">
							<div class="strip">
								<div class="name">控制要求</div>
								<div class="dec">3级</div>
								<div class="clear"></div>
							</div>
							<div class="strip">
								<div class="name">建筑面积</div>
								<div class="dec">23，000平方米</div>
								<div class="clear"></div>
							</div>
							<div class="strip">
								<div class="name">标准依据</div>
								<div class="dec">绿色建筑室内装饰评价标准</div>
								<div class="clear"></div>
							</div>
							<div class="strip">
								<div class="name">建筑层高</div>
								<div class="dec">3.0m</div>
								<div class="clear"></div>
							</div>
						</div>
						<div class="clear"></div>
					</div>
				</div>
				
				<div class="projectBox">
					<div class="projectBoxTop">
						<span class="projectBoxName">项目人员</span>
					</div>
					<div class="memberList">
						<ul>
							<li class="listDec">
								<div>角色</div>
								<div>姓名</div>
								<div>账号</div>
								<div>公司</div>
								<div class="clear"></div>
							</li>
							<li class="memberDec">
								<div>
									<span class="logo"></span>
									<span>管理员</span>
								</div>
								<div>KDD</div>
								<div>139992334556</div>
								<div>万科科技有限公司</div>
							</li>
							<li class="memberDec">
								<div>
									<span class="logo"></span>
									<span>项目经理</span>
								</div>
								<div>DDK</div>
								<div>139992334556</div>
								<div>宝能科技有限公司</div>
							</li>
							<li class="memberDec">
								<div>
									<span class="logo"></span>
									<span>设计师</span>
								</div>
								<div>KDD</div>
								<div>139992334556</div>
								<div>万科科技有限公司</div>
							</li>
						</ul>
					</div>
				</div>
				
				<div class="projectBox">
					<div class="projectBoxTop">
						<span class="projectBoxName">项目户型单</span>
					</div>
					<div class="imgTypes">
						<div class="imgType">
							<img src="img/imgtype.jpg" class="wid100"/>
						</div>
						<div class="imgType">
							<img src="img/imgtype.jpg" class="wid100"/>
						</div>
						<div class="clear"></div>
					</div>
				</div>
					
				<div class="projectBox">
					<div class="projectBoxTop">
						<span class="projectBoxName">材料控制清单</span>
					</div>
					<ul class="materialList">
						<li class="listDec">
							<div class="materialType">材料类型</div>
							<div class="materialArea">材料面积</div>
							<div class="materialImg">图片</div>
							<div class="controlRequest">
								<div class="cRFirstMenu">控制要求</div>
								<div class="cRSecondMenu">
									<div class="wid20 fl tac">
										<p class="cRSecondMenuName">甲醛</p>
										<p>（mg/m2-h）</p>
									</div>
									<div class="wid20 fl tac">
										<p class="cRSecondMenuName">TOVC</p>
										<p>（mg/m2-h）</p>
									</div>
									<div class="wid20 fl tac">
										<p class="cRSecondMenuName">苯</p>
										<p>（mg/m2-h）</p>
									</div>
									<div class="wid20 fl tac">
										<p class="cRSecondMenuName">甲苯</p>
										<p>（mg/m2-h）</p>
									</div>
									<div class="wid20 fl tac">
										<p class="cRSecondMenuName">二甲苯</p>
										<p>（mg/m2-h）</p>
									</div>
									<div class="clear"></div>
								</div>
							</div>
							<div class="clear"></div>
						</li>
						<li class="materialDec">
							<div class="materialType">强化木地板</div>
							<div class="materialArea">16.5</div>
							<div class="materialImg">
								<img src="img/materialImg.jpg"/>
							</div>
							<div class="controlRequest">
								<div class="materialContentList">
									<div class="wid20 fl tac">
										<p class="materialContent">0.3</p>
									</div>
									<div class="wid20 fl tac">
										<p class="materialContent">0.4</p>
									</div>
									<div class="wid20 fl tac">
										<p class="materialContent">0.3</p>
									</div>
									<div class="wid20 fl tac">
										<p class="materialContent">0.4</p>
									</div>
									<div class="wid20 fl tac">
										<p class="materialContent">0.3</p>
									</div>
									<div class="clear"></div>
								</div>
							</div>
							<div class="clear"></div>
						</li>
						<li class="materialDec">
							<div class="materialType">强化木地板</div>
							<div class="materialArea">16.5</div>
							<div class="materialImg">
								<img src="img/materialImg.jpg"/>
							</div>
							<div class="controlRequest">
								<div class="materialContentList">
									<div class="wid20 fl tac">
										<p class="materialContent">0.3</p>
									</div>
									<div class="wid20 fl tac">
										<p class="materialContent">0.4</p>
									</div>
									<div class="wid20 fl tac">
										<p class="materialContent">0.3</p>
									</div>
									<div class="wid20 fl tac">
										<p class="materialContent">0.4</p>
									</div>
									<div class="wid20 fl tac">
										<p class="materialContent">0.3</p>
									</div>
									<div class="clear"></div>
								</div>
							</div>
							<div class="clear"></div>
						</li>
						<li class="materialDec">
							<div class="materialType">强化木地板</div>
							<div class="materialArea">16.5</div>
							<div class="materialImg">
								<img src="img/materialImg.jpg"/>
							</div>
							<div class="controlRequest">
								<div class="materialContentList">
									<div class="wid20 fl tac">
										<p class="materialContent">0.3</p>
									</div>
									<div class="wid20 fl tac">
										<p class="materialContent">0.4</p>
									</div>
									<div class="wid20 fl tac">
										<p class="materialContent">0.3</p>
									</div>
									<div class="wid20 fl tac">
										<p class="materialContent">0.4</p>
									</div>
									<div class="wid20 fl tac">
										<p class="materialContent">0.3</p>
									</div>
									<div class="clear"></div>
								</div>
							</div>
							<div class="clear"></div>
						</li>
					</ul>
				</div>
			
				<div class="projectBox">
					<div class="projectBoxTop">
						<span class="projectBoxName">材料清单</span>
						<div class="fr">
							<span class="logo"></span>
							<span class="logo"></span>
						</div>
						<div class="clear"></div>
					</div>
					<div class="sourceList">
						<div class="sourceType">
							<div class="sourceImg">
								<img src="img/sourceImg.jpg"/>
							</div>
							<div class="sourceDec">
								<div class="name">德尔 强化木地板 | GB-300</div>
								<div class="sourceContent">
									<div class="sourceContentDec">
										<p>甲醛</p>
										<p class="sourceNum">F1</p>
									</div>
									<div class="sourceContentDec">
										<p>TVOC</p>
										<p class="sourceNum">F2</p>
									</div>
									<div class="sourceContentDec">
										<p>苯</p>
										<p class="sourceNum">F3</p>
									</div>
									<div class="sourceContentDec">
										<p>甲苯</p>
										<p class="sourceNum">F4</p>
									</div>
									<div class="sourceContentDec">
										<p>二甲苯</p>
										<p class="sourceNum">F5</p>
									</div>
									<div class="clear"></div>
								</div>
							</div>
						</div>
						
						<div class="sourceType">
							<div class="sourceImg">
								<img src="img/sourceImg.jpg"/>
							</div>
							<div class="sourceDec">
								<div class="name">德尔 强化木地板 | GB-300</div>
								<div class="sourceContent">
									<div class="sourceContentDec">
										<p>TVOC</p>
										<p class="sourceNum">F2</p>
									</div>
									<div class="sourceContentDec">
										<p>苯</p>
										<p class="sourceNum">F3</p>
									</div>
									<div class="sourceContentDec">
										<p>甲苯</p>
										<p class="sourceNum">F4</p>
									</div>
									<div class="sourceContentDec">
										<p>二甲苯</p>
										<p class="sourceNum">F5</p>
									</div>
									<div class="clear"></div>
								</div>
							</div>
						</div>
						
						<div class="sourceType">
							<div class="sourceImg">
								<img src="img/sourceImg.jpg"/>
							</div>
							<div class="sourceDec">
								<div class="name">德尔 强化木地板 | GB-300</div>
								<div class="sourceContent">
									<div class="sourceContentDec">
										<p>苯</p>
										<p class="sourceNum">F3</p>
									</div>
									<div class="sourceContentDec">
										<p>甲苯</p>
										<p class="sourceNum">F4</p>
									</div>
									<div class="sourceContentDec">
										<p>二甲苯</p>
										<p class="sourceNum">F5</p>
									</div>
									<div class="clear"></div>
								</div>
							</div>
						</div>
						
						<div class="sourceType">
							<div class="sourceImg">
								<img src="img/sourceImg.jpg"/>
							</div>
							<div class="sourceDec">
								<div class="name">德尔 强化木地板 | GB-300</div>
								<div class="sourceContent">
									<div class="sourceContentDec">
										<p>甲苯</p>
										<p class="sourceNum">F4</p>
									</div>
									<div class="sourceContentDec">
										<p>二甲苯</p>
										<p class="sourceNum">F5</p>
									</div>
									<div class="clear"></div>
								</div>
							</div>
						</div>
						
						
						<div class="sourceType">
							<div class="sourceImg">
								<img src="img/sourceImg.jpg"/>
							</div>
							<div class="sourceDec">
								<div class="name">德尔 强化木地板 | GB-300</div>
								<div class="sourceContent">
									<div class="sourceContentDec">
										<p>二甲苯</p>
										<p class="sourceNum">F5</p>
									</div>
									<div class="clear"></div>
								</div>
							</div>
						</div>
						<div class="clear"></div>
					</div>
				</div>
			</div>
			<!--项目圈内容 end-->
		</div>
		<!--内容 end-->
		
	</body>
	<script type="text/javascript" src="js/jquery.min.js"></script>
	<!--网页文案排版-->
	<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pangu/3.3.0/pangu.min.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
			//获取content宽度
			var contentWidth = $(window).innerWidth() - 180;
			$('.content').css('width',contentWidth + 'px');
		});
	</script>
</html>
